@charset "utf-8";
*{padding:0;margin:0;}
li{list-style: none;}

#wrap{width:280px;margin: 0 auto;}

#kalendar{width: 280px; margin:0 auto;}
#calendar {
  width: 50px;
  float: left;
  margin-top:7px;
  text-align:center;
}
#calendar img{ width:30px;}
/* 选择年月 的行 */
#kalendar tr#select{height:30px;}
#kalendar tr#select td{clear:both; font-size: 0; text-align: center;}
#kalendar tr#select td div{display: inline-block; height:26px;}
#kalendar tr#select #year{width: 76px; margin-top:10px;}
#kalendar tr#select #month{width: 76px; margin: 0 5px;}
#select #year ul,#select #month ul{clear:both; overflow: hidden; height: 100%;}
#select #year ul li,#select #month ul li{float:left;width:20px;}
#select #year ul li input{display: none;}
#select #year ul li input,#select #month ul li input{width:100%; height: 26px; cursor:pointer; border: none; background: #f8f4f4; border: 1px solid #d8d8d8; color: #b5b5b5; line-height: 20px;}
#select #year ul li.selectChange,#select #month ul li.selectChange{width:75px;height:100%;}
#select #year ul li.selectChange select,#select #month ul li.selectChange select{width:76px; height: 100%; background: #f8f4f4; padding-left:3px;cursor:pointer; border-color: #d8d8d8;border: 1px solid #c13434;}

#select #year ul li.selectChange select option,#select #month ul li.selectChange select option{padding-left:5px;}
#select .backtoday{background: none; border: 1px solid #d8d8d8; font-size: 12px; width: 64px; margin-top:10px; height: 26px; display: inline-block; vertical-align: top; background:#c13434; color:#FFF;}

/* 星期表头 的行 */
#kalendar tr#week{height:50px;}
#kalendar tr#week td ul{width:280px;clear:both;}
#kalendar tr#week td ul li{float:left;width:40px;height:40px;line-height:40px;text-align:center;}

/* 某月具体日期 的每一行 */
#kalendar tr#day{height: 254px;}
#kalendar tr#day ul.dayList{width:280px;height:40px;clear:both;margin:2px auto;}
#kalendar tr#day ul.dayList li{float:left;width:40px;height:40px;line-height:36px; border: 2px solid transparent; text-align:center;cursor:pointer; -webkit-border-radius: 50%; border-radius: 50%; position: relative; font-size: 12px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}

/* 日期占用行数(4-6行)，将不需要显示的行隐藏 */
#kalendar tr#day ul.hide{display:none;}
/* 周末 的特殊样式 */
#week .weekend,#day .weekend{color:#ba2e2f;}

/* 下面几个样式注意顺序，选择器不能简写，否则日历中 今天 的样式会被鼠标滑过的样式替换 */
/* 鼠标经过某个日期 的特殊样式 */
#kalendar tr#day td ul.dayList li.mouseFloat{border-color: #ccc;}
/* 当天是周末 的特殊样式 */
#kalendar tr#day td ul.dayList li.todayWeekend{border-color: #ba2e2f; color: #ba2e2f;}
/* 当天 的特殊样式 */
#kalendar tr#day td ul.dayList li.today:hover,#kalendar tr#day td ul.dayList li.on{border-color: #ba2e2f;}
#kalendar tr#day td ul.dayList li span{width: 100%; height: 6px; display: block; position: absolute; bottom: 5px; left: 0; text-align: center; overflow: hidden;}
#kalendar tr#day td ul.dayList li i{display: inline-block; width: 6px; height: 6px; border-radius: 3px; vertical-align: top; margin: 0 1px;}
#kalendar tr#day td ul.dayList li i.in{background: #cc3536;}
#kalendar tr#day td ul.dayList li i.out{background: #3366ff;}
#kalendar tr#day td ul.dayList li i.promotion{background: #FFA500;}
@media screen and (max-width: 1400px) and (min-width: 1200px){	
	.banner_block .meeting_date h3{padding: 10px 20px 1px;}
	#kalendar tr#week{height:30px;}
	#kalendar tr#week td ul li{height:25px}
	.banner_block .meeting_date .tip{padding: 0px 10px !important;}
	.homeBanner img{height:389px;width:97%;}
	.homeBanner .sp-slides-container{height:389px !important;}
	.homeBanner .sp-thumbnail-image-container{width:160px;}
	.homeBanner .sp-previous-arrow,.homeBanner .sp-next-arrow{width:160px;}
	.homeBanner .sp-thumbnail-image-container img{height:78px;}
	.homeBanner .sp-right-thumbnails{background:#fff;}
	.homeBanner{padding-right:167px !important}
}
@media screen and (max-width: 1200px) and (min-width: 1000px){	
	.layui-container{width:1100px;}
	.banner_block .meeting_date h3{padding: 10px 20px 3px;}
	#kalendar tr#week{height:30px;}
	#kalendar tr#week td ul li{height:25px}
	.banner_block .meeting_date .tip{padding: 0px 10px !important;}
	.homeBanner img{height:389px;width:97%;}
	.homeBanner .sp-slides-container{height:389px !important;}
	.homeBanner .sp-thumbnail-image-container{width:160px;}
	.homeBanner .sp-previous-arrow,.homeBanner .sp-next-arrow{width:160px;}
	.homeBanner .sp-thumbnail-image-container img{height:78px;}
	.homeBanner .sp-right-thumbnails{background:#fff;}
}
@media screen and (max-width: 768px){	
	.body-no-scroll{height:100%;overflow:hidden;}
	.banner_block .meeting_date{background: #fff; display: none; position: fixed !important; top: 92px; left: 0; width: 100%;z-index:999}
	#wrap,#kalendar{width: 100%; padding: 0 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
	#kalendar tr#select #year{width: 30%; float: left; display: block;}
	#select #year ul li.selectChange{width: 100%;}
	#select #year ul li.selectChange select,#select #month ul li.selectChange select{width: 100%; background: #fff;}
	#select #year ul li input, #select #month ul li input{background: #fff;}
	#kalendar tr#select #month{width: 37%; float: left; display: block; margin: 0 1%;}
	#select #month ul li.selectChange{width: calc(100% - 40px);}
	#select .backtoday{width: 30%; float: left; display: block;}
	#kalendar tr#week td ul{width: 100%; overflow: hidden;}
	#kalendar tr#week td ul li{width: calc((100vw - 40px) / 7); height: calc((100vw - 40px) / 7); line-height: calc((100vw - 40px) / 7);}
	#kalendar tr#day ul.dayList{width: 100%; height: calc((100vw - 40px) / 7); margin: 0;}
	#kalendar tr#day ul.dayList li{width: calc((100vw - 40px) / 7); height: calc((100vw - 40px) / 7); line-height: 34px !important; border-radius: 0; border: none;}
	#kalendar tr#day td ul.dayList li.today{background: #fdf2f2 !important;}
}